<template>
  <div class="content">
    <div class="title">热门精选</div>
    <div class="list">
      <template v-for="item in houseList" :key="item.data.houseId">
        <houseItemType9Vue
          v-if="item.discoveryContentType === 9"
          :itemData="item.data"
          @click="itemClickHandle(item.data)"
        />
        <houseItemType3Vue
          v-if="item.discoveryContentType === 3"
          :itemData="item.data"
          @click="itemClickHandle(item.data)"
        />
      </template>
    </div>
  </div>
</template>

<script setup>
import { storeToRefs } from "pinia";
import useHomeStore from "../../../stores/modules/homeStore";
import houseItemType3Vue from "../../../components/house-item-type3/house-item-type3.vue";
import houseItemType9Vue from "../../../components/house-item-type9/house-item-type9.vue";
import { useRouter } from "vue-router";
const homeStore = useHomeStore();
const { houseList } = storeToRefs(homeStore);
const router = useRouter();
// 点击跳转到详情页
const itemClickHandle = (item) => {
  router.push(
    "/detail/" + item.houseId + "/" + item.productPrice + "/" + item.finalPrice
  );
};
</script>

<style lang="less" scoped>
.content {
  padding: 10px;
  .title {
    font-size: 20px;
    font-weight: 700;
  }
}
.list {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
}
</style>
